<!--<template>
  &lt;!&ndash;新增/编辑任务&ndash;&gt;
  &lt;!&ndash; <vx-popup
     :title="addtitle"
     width="900px"
     @close="cancelFormSubmit"
     :active.sync="dialogVisible"
     @confirmPopup="submit"
     @cancelPopup="cancelFormSubmit"
   >
     <el-form
       :model="ruleForm"
       :rules="rules"
       ref="ruleForm"
       label-width="100px"
       class="demo-ruleForm"
     >
       <el-row justify="space-between" :gutter="24">
         <el-col :span="8">
           <el-form-item label="桥梁名称:" prop="name">
             <el-input v-model.trim="ruleForm.name" size="small" clearable placeholder="请输入桥梁名称"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="桥梁编码:" prop="code">
             <el-input v-model.trim="ruleForm.code" size="small" clearable placeholder="请输入桥梁编号"></el-input>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="桥梁全长:" prop="length">
             <el-input v-model.trim="ruleForm.length" size="small" clearable placeholder="请输入桥梁全长"></el-input>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row justify="space-between" :gutter="24">
         <el-col :span="8">
           <el-form-item label="桥梁规范:" prop="standardId">
             <el-select
               v-model="ruleForm.standardId"
               placeholder="请选择桥梁规范"
               size="small"
               @change="changeStandardId"
               clearable
             >
               <el-option
                 v-for="(item,index) in standardList"
                 :key="index"
                 :label="item.label"
                 :value="item.value"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="桥梁类型:" prop="bridgeTypeId">
             <el-select
               v-model="ruleForm.bridgeTypeId"
               placeholder="请选择桥梁类型"
               size="small"
               @change="changeType"
               clearable
             >
               <el-option
                 v-for="(item,index) in bridgeList"
                 :key="index"
                 :label="item.name"
                 :value="item.id"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="桥梁种类:" prop="bridgeKindId">
             <el-select
               v-model="ruleForm.bridgeKindId"
               placeholder="请选择桥梁种类"
               size="small"
               @change="changeKind"
               clearable
             >
               <el-option
                 v-for="(item,index) in kindList"
                 :key="index"
                 :label="item.name"
                 :value="item.id"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row justify="space-between" :gutter="24">
         <el-col :span="8">
           <el-form-item label="养护类别:" prop="maintenanceType">
             <el-select
               v-model="ruleForm.maintenanceType"
               placeholder="请选择养护类别"
               size="small"
               @change="changeMaintenanceType"
               clearable
             >
               <el-option
                 v-for="(item,index) in mainList"
                 :key="index"
                 :label="item.label"
                 :value="item.value"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="养护级别:" prop="maintenanceLevel">
             <el-select v-model="ruleForm.maintenanceLevel" placeholder="请选择养护级别" size="small" clearable>
               <el-option
                 v-for="(item,index) in typeList"
                 :key="index"
                 :label="item.label"
                 :value="item.value"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="运行状态:" prop="status">
             <el-radio-group v-model="ruleForm.status" size="small">
               <el-radio :label="0">停用</el-radio>
               <el-radio :label="1">启用</el-radio>
             </el-radio-group>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row justify="space-between" :gutter="24">
         <el-col :span="8">
           <el-form-item label="所属省:" prop="provinceCode">
             <el-select
               v-model="ruleForm.provinceCode"
               placeholder="请选择省"
               size="small"
               @change="changeRuleRegion(ruleForm.provinceCode)"
               clearable
             >
               <el-option
                 v-for="item in options"
                 :key="item.regionCode"
                 :label="item.regionName"
                 :value="item.regionCode"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="所属市:" prop="municipalityCode">
             <el-select
               v-model="ruleForm.municipalityCode"
               placeholder="请选择市"
               size="small"
               @change="changeRuleCity(ruleForm.municipalityCode)"
               clearable
             >
               <el-option
                 v-for="item in ruleCityOptions"
                 :key="item.regionCode"
                 :label="item.regionName"
                 :value="item.regionCode"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
         <el-col :span="8">
           <el-form-item label="所属区:" prop="regionCode">
             <el-select
               v-model="ruleForm.regionCode"
               placeholder="请选择区"
               size="small"
               @change="changeRuleArea(ruleForm.regionCode)"
               clearable
             >
               <el-option
                 v-for="item in ruleAreaOptions"
                 :key="item.regionCode"
                 :label="item.regionName"
                 :value="item.regionCode"
               ></el-option>
             </el-select>
           </el-form-item>
         </el-col>
       </el-row>
       <el-row>
         <el-col :span="10">
           <el-form-item label="桥梁位置:">
             <div v-if="addtitle === '新增桥梁'">

               <div class="map_box" id="map">
                 &lt;!&ndash; <el-input
                 v-model.trim="address"
                 id="suggestId"
                 name="ruleForm.address"
                 size="small"
                 class="item"
                 placeholder="请输入关键字"
               ></el-input> &ndash;&gt;
               </div>
             </div>
             <div v-else style="width:360px;">
               <div class="map_box" id="mapContaion">
                 &lt;!&ndash; <el-input
                 v-model.trim="address"
                 id="suggestId"
                 name="ruleForm.address"
                 size="small"
                 class="item"
                 placeholder="请输入关键字"
               ></el-input> &ndash;&gt;
               </div>
             </div>
           </el-form-item>
         </el-col>
       </el-row>
       <el-form-item label="桥梁简介:" prop="desc">
         <el-input
           type="textarea"
           v-model.trim="ruleForm.desc"
           maxlength="500"
           show-word-limit
           size="small"
           clearable
         ></el-input>
       </el-form-item>
       <el-form-item label="桥梁图片:" prop="realisticPictureList">
         <el-upload
           :action="upload"
           list-type="picture-card"
           :on-remove="removeRender"
           :on-success="handleSuccessRender"
           :file-list="imgList"
           :limit="1"
         >
           <i class="el-icon-plus avatar-uploader-icon"></i>
         </el-upload>
       </el-form-item>
     </el-form>
   </vx-popup>&ndash;&gt;
  <vx-popup :title="dialogTitle" width="970px" @close="cancelSubmit" :active.sync="dialogVisible"
            @confirmPopup="handleSubmit" @cancelPopup="cancelSubmit">
    <el-form :model="ruleForm"  ref="ruleForm" class="demo-ruleForm">
      <div class="insp-task-addPage-basic">
        <el-row justify="space-between" :gutter="24">
          <el-col :span="8">
            <el-form-item label="计划名称:" prop="name">
              <el-input style="width: 200px" v-model.trim="ruleForm.name" size="small" clearable placeholder="请输入计划名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="起始时间:" prop="startTime">
              <el-input style="width: 200px" v-model.trim="ruleForm.code" size="small" clearable placeholder="请输入起始时间"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="终止时间:" prop="endTime">
              <el-input style="width: 200px" v-model.trim="ruleForm.length" size="small" clearable placeholder="请输入终止时间"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row justify="space-between" :gutter="24">
          <el-col :span="8">
            <el-form-item label="计划频率:" prop="frequency">
              <el-input style="width: 200px" v-model.trim="ruleForm.code" size="small" clearable placeholder="请输入起始时间"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计划状态:" prop="endTime">

            </el-form-item>
          </el-col>
        </el-row>
      </div>





    </el-form>
  </vx-popup>

</template>

<script>
  export default {
    props: {
      createType: {
        type: Number,
        required: true,
        default: 4
      }
    },
    data() {
      return {
        isResouceShow: 0,
        dialogTitle: '新增巡检计划',
        dialogVisible: false,
        editId: '',
        bridgeOptions: [],
        personOptions: [],
        deasePosOptions: {},
        ruleForm: {
          name: '',
          inspType: '',
          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            sdt: '',
            duration: '',
            itemUserList: []
          }]
        },
        rules: {
          name: [{
            required: true,
            message: "请输入任务名称",
            trigger: "blur"
          }],
          inspType: [{
            required: true,
            message: "请选择巡检类型",
            trigger: "change"
          }]
        },
        currentPage_sel: 1,
        pagesize_sel: 10,
        recordsTotal_sel: 0
      };
    },
    created() {
      this.queryBridgeList();
      this.queryPersonList(1);
    },
    methods: {
      add(val) {
        this.emptyForm();
        this.editId = null;
        if (this.createType === 1) {
          this.queryTmplById(val);
        }
        if (this.createType === 3) {
          this.queryPlanById(val);
        }
        this.dialogTitle = '新增巡检计划';
        this.dialogVisible = true;
      },
      edit(val) {
        this.$refs["ruleForm"].resetFields();
        this.dialogTitle = '编辑巡检计划';
        this.dialogVisible = true;
        this.editId = val;
        this.queryTaskById(val);
      },
      emptyForm() {
        this.$refs["ruleForm"].resetFields();
        const emptyObj = {
          name: '',
          inspType: '',

          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            itemUserList: [],
            duration: '',
            sdt: ''
          }]
        }
        this.ruleForm = emptyObj;
      },
      queryBridgeList() {
        this.$api.bridge.AllTheBridges().then(response => {
          console.log('桥梁列表');
          console.log(response);
          if (response.data.success) {
            this.bridgeOptions = response.data.data[0];
            console.log(this.bridgeOptions);
          }
        });
      },
      queryTaskById(val) {
        this.$api.insp.queryTaskById(val).then(response => {
          console.log('任务详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
        });
      },
      queryTmplById(val) {
        this.$api.insp.queryTmplById(val).then(response => {
          console.log('模板详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      queryPlanById(val) {
        this.$api.insp.queryPlanById(val).then(response => {
          console.log('计划详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);

            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      handleAddLine() {
        this.ruleForm.inspBridges.push({
          bridge: '',
          name: [],
          inspStandard: '',
          sdt: '',
          duration: '',
          itemUserList: []
        });
      },
      handleDeleteItem(item, index) {
        this.ruleForm.inspBridges.splice(index, 1);
      },
      handleSubmit() {
        this.$refs.ruleForm.validate(async (valid) => {
          if (!valid) {
            return false;
          }
          let _userInfo = JSON.parse(localStorage.getItem("userInfo"));
          let _itemList = this.ruleForm.inspBridges.map(item => {
            let _itemUserList = item.itemUserList.map(temp => ({
              userId: temp.split(';')[0],
              userName: temp.split(';')[1],
            }));
            let _ext1 = {
              // ...item.bridge,
              id: item.bridge['id'] || '',
              name: item.bridge['name'] || '',
              lng: item.bridge['lng'] || '',
              lat: item.bridge['lat'] || '',
              bridgeTypeId: item.bridge['bridgeTypeId'] || '',
              bridgeTypeName: item.bridge['bridgeTypeName'] || '',
              province: item.bridge['provinceName'] ? item.bridge['provinceName'] : item.bridge[
                'province'] ? item.bridge['province'] : '',
              city: item.bridge['municipalityName'] ? item.bridge['municipalityName'] : item.bridge[
                'city'] ? item.bridge['city'] : '',
              area: item.bridge['regionName'] ? item.bridge['regionName'] : item.bridge[
                'area'] ? item.bridge['area'] : '',
              standardName: item.bridge['standardName'] || '',
            };
            return {
              name: item.name.length > 0 ? `${item.name[0].split(';')[1]}/${item.name[1].split(';')[1]}` : '',
              constructionId: item.name.length > 0 ? item.name[0].split(';')[0] : '',
              constructionName: item.name.length > 0 ? item.name[0].split(';')[1] : '',
              partsId: item.name.length > 0 ? item.name[1].split(';')[0] : '',
              partsName: item.name.length > 0 ? item.name[1].split(';')[1] : '',
              ownId: item.bridge['id'] || '',
              ownName: item.bridge['name'] || '',
              inspTaskCfgPos: {
                ownId: item.bridge['id'] || '',
                ownName: item.bridge['name'] || '',
                lon: item.bridge['lng'] || '',
                lat: item.bridge['lat'] || '',
              },
              inspStandard: item.inspStandard,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration,
              ext1: JSON.stringify(_ext1)
            }
          });
          let _params = {
            createUserId: _userInfo['userid'] || '',
            createUserName: _userInfo['realname'] || '',
            createType: this.createType,
            name: this.ruleForm.name,
            inspType: this.ruleForm.inspType,
            itemList: _itemList
          };

          if (this.editId) {
            _params.id = this.editId;
          }
          if (this.editId) {
            this.$api.insp.updateTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '修改成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          } else {
            this.$api.insp.addTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '新增成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          }
        });
      },
      cancelSubmit() {
        this.dialogVisible = false;
      },
      handleBridgeChange(event, index) {
        console.log(event);
        const _params = {
          bridgeTypeId: event['bridgeTypeId'] || '',
          pId: '-1',
          bridgeId: event['id'] || ''
        };
        this.queryConstructionModelTreeById(_params, index);
      },
      handleChangeDeasePos(event, index) {
        console.log(this.ruleForm.inspBridges[index].name);
      },
      deepDeasePosOptions(data) {
        let _arr = [];
        let _obj = {};
        data.forEach(item => {
          const _tmp = {
            ...item
          };
          if (_tmp.children && _tmp.children.length > 0) {
            _tmp.children = this.deepDeasePosOptions(_tmp.children);
          }
          _obj = {
            id: _tmp.id,
            name: _tmp.name,
            value: `${_tmp.id};${_tmp.name}`,
          }
          if (_tmp.children && _tmp.children.length > 0) {
            _obj.children = _tmp.children;
          }
          _arr.push(_obj);
        });
        return _arr;
      },
      queryConstructionModelTreeById(_params, index) {
        this.$api.bridge.queryConstructionModelTreeById(_params).then(response => {
          if (response.data.success) {
            ++this.isResouceShow;
            this.deasePosOptions[index] = this.deepDeasePosOptions(response.data.data.children);
          }
        });
      },
      queryPersonList(pageIndex) {
        if (pageIndex && pageIndex === 1) {
          this.currentPage_sel = 1;
        }
        const _params = {
          pageSize: this.pagesize_sel,
          pageNum: this.currentPage_sel,
          type: '0'
        }
        this.$api.personManager.getPersonList(_params).then(response => {
          if (response.data.success) {
            this.personOptions = response.data.data;
            this.recordsTotal_sel = response.data.recordsTotal;
          }
        });
      },
      handlePageChange_sel(currentPage) {
        this.currentPage_sel = currentPage;
        this.queryPersonList();
      },
    }
  }

</script>
<style lang="scss" scoped>
  @import '@/assets/scss/baseColor.scss';
  @import '../insp.scss';

</style>-->
<!--<template>
  &lt;!&ndash;新增/编辑任务&ndash;&gt;&lt;!&ndash;:rules="rules"&ndash;&gt;
  <vx-popup :title="dialogTitle" width="970px" @close="cancelSubmit" :active.sync="dialogVisible"
            @confirmPopup="handleSubmit" @cancelPopup="cancelSubmit">
    <el-form :model="ruleForm"  ref="ruleForm" class="demo-ruleForm">

     &lt;!&ndash; <div class="insp-task-addPage-basic" v-for="(item,index) in ruleForm.inspBridges" >
        <el-row justify="space-between" :gutter="24">
          <el-col :span="8">
            <el-form-item label="计划名称 :" prop="name" label-width="95px">
              <el-input v-model="ruleForm.name" placeholder="请输入任务名称" size="small" style="width:100%" clearable>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
           &lt;!&ndash; <el-form-item label="巡检类型 :" prop="inspType" label-width="95px">
              <el-select v-model="ruleForm.inspType" placeholder="请选择巡检类型" size="small" style="width:100%" clearable>
                <el-option label="日常巡检" :value="0"></el-option>
                <el-option label="定期巡检" :value="1"></el-option>
                &lt;!&ndash; <el-option label="特殊巡检" :value="2"></el-option> &ndash;&gt;
              </el-select>
            </el-form-item>&ndash;&gt;
            <el-form-item label="起始时间 :" prop="startTime" label-width="95px">
              <el-input v-model="ruleForm.name" placeholder="请输入起始时间" size="small" style="width:100%" clearable>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="终止时间 :" prop="endTime" label-width="95px">
              <el-input v-model="ruleForm.name" placeholder="请输入起始时间" size="small" style="width:100%" clearable>
              </el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </div>&ndash;&gt;

      <div class="insp-task-addPage-line" v-for="(item,index) in ruleForm.inspBridges" :key="index"
           style="height:600px;">
        <div class="insp-task-addPage-left">
          <div class="insp-task-addPage-item">
            <el-form-item label="计划名称 :" prop="name" label-width="95px">
              <el-input v-model="ruleForm.name" placeholder="请输入任务名称" size="small" style="width:100%" clearable>
              </el-input>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="起始时间 :" :prop="'inspBridges[' + index + '].sdt'"
                          :rules="{required: true, message: '请选择开始时间', trigger: 'change'}" label-width="95px">
              <el-date-picker v-model="item.sdt" type="datetime" size="small" placeholder="请选择开始时间"
                              default-time="12:00:00" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
                              style="width:165px" clearable>
              </el-date-picker>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="终止时间 :" :prop="'inspBridges[' + index + '].sdt'"
                          :rules="{required: true, message: '请选择开始时间', trigger: 'change'}" label-width="95px">
              <el-date-picker v-model="item.sdt" type="datetime" size="small" placeholder="请选择开始时间"
                              default-time="12:00:00" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
                              style="width:165px" clearable>
              </el-date-picker>
            </el-form-item>
          </div>


          <div class="insp-task-addPage-item">
            <el-form-item label="巡检桥梁 :" :prop="'inspBridges[' + index + '].bridge'"
                          :rules="{required: true, message: '请选择巡检桥梁', trigger: 'change'}" label-width="95px">
              <el-select v-model="item.bridge" placeholder="请选择巡检桥梁" size="small" style="width:165px"
                         @change="(event)=>handleBridgeChange(event,index)" value-key="id" clearable>
                <el-option v-for="temp in bridgeOptions" :key="temp.id" :label="temp.name" :value="temp">
                </el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="巡检项 :" :prop="'inspBridges[' + index + '].name'"
                          :rules="{required: false, message: '请选择巡检项', trigger: 'change'}" label-width="95px">
              <el-cascader v-model="item.name" :options="deasePosOptions[index]||[]"
                           @change="(event)=>handleChangeDeasePos(event,index)" :key="isResouceShow"
                           :props="{label:'name',value:'value',children:'children'}" size="small" style="width:165px"
                           placeholder="请选择巡检项" clearable>
              </el-cascader>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="巡检员 :" :prop="'inspBridges[' + index + '].itemUserList'"
                          :rules="{required: true, message: '请选择巡检员', trigger: 'change'}" label-width="95px">
              <el-select v-model="item.itemUserList" placeholder="请选择巡检员" size="small" multiple collapse-tags
                         style="width:165px" clearable>
                <el-option v-for="item in personOptions" :key="item.realId" :label="item.name"
                           :value="`${item.realId};${item.name}`">
                </el-option>
                <div style="text-align:center">
                  <el-pagination @current-change="handlePageChange_sel" :current-page.sync="currentPage_sel"
                                 :hide-on-single-page="true" :page-size="pagesize_sel" layout="prev, pager, next"
                                 :total="recordsTotal_sel">
                  </el-pagination>
                </div>
              </el-select>
            </el-form-item>
          </div>

          <div class="insp-task-addPage-item">
            <el-form-item label="巡检规范 :" :prop="'inspBridges[' + index + '].inspStandard'"
                          :rules="{required: true, message: '请选择巡检规范', trigger: 'change'}" label-width="95px">
              <el-select v-model="item.inspStandard" placeholder="请选择巡检规范" size="small" style="width:165px" clearable>
                <el-option label="城市桥梁" :value="0"></el-option>
                <el-option label="道路桥梁" :value="1"></el-option>
              </el-select>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="开始时间 :" :prop="'inspBridges[' + index + '].sdt'"
                          :rules="{required: true, message: '请选择开始时间', trigger: 'change'}" label-width="95px">
              <el-date-picker v-model="item.sdt" type="datetime" size="small" placeholder="请选择开始时间"
                              default-time="12:00:00" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
                              style="width:165px" clearable>
              </el-date-picker>
            </el-form-item>
          </div>
          <div class="insp-task-addPage-item">
            <el-form-item label="任务周期 :" :prop="'inspBridges[' + index + '].duration'"
                          :rules="{required: true, message: '请输入任务周期', trigger: 'blur'}" label-width="95px">
              <el-input size="small" v-model="item.duration" placeholder="请输入" style="width:165px" clearable type="number">
                <template slot="append">天</template>
              </el-input>
            </el-form-item>
          </div>
        </div>
      </div>


    </el-form>
  </vx-popup>

</template>

<script>
  export default {
    props: {
      createType: {
        type: Number,
        required: true,
        default: 4
      }
    },
    data() {
      return {
        isResouceShow: 0,
        dialogTitle: '新增任务',
        dialogVisible: false,
        editId: '',
        bridgeOptions: [],
        personOptions: [],
        deasePosOptions: {},
        ruleForm: {
          name: '',
          inspType: '',
          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            sdt: '',
            duration: '',
            itemUserList: []
          }]
        },
        rules: {
          name: [{
            required: true,
            message: "请输入任务名称",
            trigger: "blur"
          }],
          inspType: [{
            required: true,
            message: "请选择巡检类型",
            trigger: "change"
          }]
        },
        currentPage_sel: 1,
        pagesize_sel: 10,
        recordsTotal_sel: 0
      };
    },
    created() {
      this.queryBridgeList();
      this.queryPersonList(1);
    },
    methods: {
      add(val) {
        this.emptyForm();
        this.editId = null;
        if (this.createType === 1) {
          this.queryTmplById(val);
        }
        if (this.createType === 3) {
          this.queryPlanById(val);
        }
        this.dialogTitle = '新增任务';
        this.dialogVisible = true;
      },
      edit(val) {
        this.$refs["ruleForm"].resetFields();
        this.dialogTitle = '编辑任务';
        this.dialogVisible = true;
        this.editId = val;
        this.queryTaskById(val);
      },
      emptyForm() {
        this.$refs["ruleForm"].resetFields();
        const emptyObj = {
          name: '',
          inspType: '',

          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            itemUserList: [],
            duration: '',
            sdt: ''
          }]
        }
        this.ruleForm = emptyObj;
      },
      queryBridgeList() {
        this.$api.bridge.AllTheBridges().then(response => {
          console.log('桥梁列表');
          console.log(response);
          if (response.data.success) {
            this.bridgeOptions = response.data.data[0];
            console.log(this.bridgeOptions);
          }
        });
      },
      queryTaskById(val) {
        this.$api.insp.queryTaskById(val).then(response => {
          console.log('任务详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
        });
      },
      queryTmplById(val) {
        this.$api.insp.queryTmplById(val).then(response => {
          console.log('模板详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      queryPlanById(val) {
        this.$api.insp.queryPlanById(val).then(response => {
          console.log('计划详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);

            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      handleAddLine() {
        this.ruleForm.inspBridges.push({
          bridge: '',
          name: [],
          inspStandard: '',
          sdt: '',
          duration: '',
          itemUserList: []
        });
      },
      handleDeleteItem(item, index) {
        this.ruleForm.inspBridges.splice(index, 1);
      },
      handleSubmit() {
        this.$refs.ruleForm.validate(async (valid) => {
          if (!valid) {
            return false;
          }
          let _userInfo = JSON.parse(localStorage.getItem("userInfo"));
          let _itemList = this.ruleForm.inspBridges.map(item => {
            let _itemUserList = item.itemUserList.map(temp => ({
              userId: temp.split(';')[0],
              userName: temp.split(';')[1],
            }));
            let _ext1 = {
              // ...item.bridge,
              id: item.bridge['id'] || '',
              name: item.bridge['name'] || '',
              lng: item.bridge['lng'] || '',
              lat: item.bridge['lat'] || '',
              bridgeTypeId: item.bridge['bridgeTypeId'] || '',
              bridgeTypeName: item.bridge['bridgeTypeName'] || '',
              province: item.bridge['provinceName'] ? item.bridge['provinceName'] : item.bridge[
                'province'] ? item.bridge['province'] : '',
              city: item.bridge['municipalityName'] ? item.bridge['municipalityName'] : item.bridge[
                'city'] ? item.bridge['city'] : '',
              area: item.bridge['regionName'] ? item.bridge['regionName'] : item.bridge[
                'area'] ? item.bridge['area'] : '',
              standardName: item.bridge['standardName'] || '',
            };
            return {
              name: item.name.length > 0 ? `${item.name[0].split(';')[1]}/${item.name[1].split(';')[1]}` : '',
              constructionId: item.name.length > 0 ? item.name[0].split(';')[0] : '',
              constructionName: item.name.length > 0 ? item.name[0].split(';')[1] : '',
              partsId: item.name.length > 0 ? item.name[1].split(';')[0] : '',
              partsName: item.name.length > 0 ? item.name[1].split(';')[1] : '',
              ownId: item.bridge['id'] || '',
              ownName: item.bridge['name'] || '',
              inspTaskCfgPos: {
                ownId: item.bridge['id'] || '',
                ownName: item.bridge['name'] || '',
                lon: item.bridge['lng'] || '',
                lat: item.bridge['lat'] || '',
              },
              inspStandard: item.inspStandard,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration,
              ext1: JSON.stringify(_ext1)
            }
          });
          let _params = {
            createUserId: _userInfo['userid'] || '',
            createUserName: _userInfo['realname'] || '',
            createType: this.createType,
            name: this.ruleForm.name,
            inspType: this.ruleForm.inspType,
            itemList: _itemList
          };

          if (this.editId) {
            _params.id = this.editId;
          }
          if (this.editId) {
            this.$api.insp.updateTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '修改成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          } else {
            this.$api.insp.addTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '新增成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          }
        });
      },
      cancelSubmit() {
        this.dialogVisible = false;
      },
      handleBridgeChange(event, index) {
        console.log(event);
        const _params = {
          bridgeTypeId: event['bridgeTypeId'] || '',
          pId: '-1',
          bridgeId: event['id'] || ''
        };
        this.queryConstructionModelTreeById(_params, index);
      },
      handleChangeDeasePos(event, index) {
        console.log(this.ruleForm.inspBridges[index].name);
      },
      deepDeasePosOptions(data) {
        let _arr = [];
        let _obj = {};
        data.forEach(item => {
          const _tmp = {
            ...item
          };
          if (_tmp.children && _tmp.children.length > 0) {
            _tmp.children = this.deepDeasePosOptions(_tmp.children);
          }
          _obj = {
            id: _tmp.id,
            name: _tmp.name,
            value: `${_tmp.id};${_tmp.name}`,
          }
          if (_tmp.children && _tmp.children.length > 0) {
            _obj.children = _tmp.children;
          }
          _arr.push(_obj);
        });
        return _arr;
      },
      queryConstructionModelTreeById(_params, index) {
        this.$api.bridge.queryConstructionModelTreeById(_params).then(response => {
          if (response.data.success) {
            ++this.isResouceShow;
            this.deasePosOptions[index] = this.deepDeasePosOptions(response.data.data.children);
          }
        });
      },
      queryPersonList(pageIndex) {
        if (pageIndex && pageIndex === 1) {
          this.currentPage_sel = 1;
        }
        const _params = {
          pageSize: this.pagesize_sel,
          pageNum: this.currentPage_sel,
          type: '0'
        }
        this.$api.personManager.getPersonList(_params).then(response => {
          if (response.data.success) {
            this.personOptions = response.data.data;
            this.recordsTotal_sel = response.data.recordsTotal;
          }
        });
      },
      handlePageChange_sel(currentPage) {
        this.currentPage_sel = currentPage;
        this.queryPersonList();
      },
    }
  }

</script>
<style lang="scss" scoped>
  @import '@/assets/scss/baseColor.scss';
  @import '../insp.scss';

</style>-->
<template>
  <!--新增/编辑任务-->
  <vx-popup :title="dialogTitle" width="970px" @close="cancelSubmit" :active.sync="dialogVisible"
            @confirmPopup="handleSubmit" @cancelPopup="cancelSubmit">
    <el-form :model="ruleForm" :rules="rules" ref="ruleForm" class="demo-ruleForm">
      <div class="insp-task-addPage-line" v-for="(item,index) in ruleForm.inspBridges" :key="index"
           style="height:660px;">
        <div class="insp-task-addPage-left">
          <el-row  justify="space-between" :gutter="24">
            <el-col :span="8">
              <el-form-item label="任务名称:" :prop="name" :rules="{required: true, message: '请输入任务名称', trigger: 'change'}" label-width="95px">
                <el-input v-model="ruleForm.name" placeholder="请输入任务名称" size="small" style="width:100%" clearable>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="开始时间 :" :prop="'inspBridges[' + index + '].sdt'"
                            :rules="{required: true, message: '请选择开始时间', trigger: 'change'}" label-width="95px">
                <el-date-picker v-model="item.sdt" type="datetime" size="small" placeholder="请选择开始时间"
                                default-time="12:00:00" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
                                style="width:165px" clearable>
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="结束时间 :" :prop="'inspBridges[' + index + '].sdt'"
                            :rules="{required: true, message: '请选择终止时间', trigger: 'change'}" label-width="95px">
                <el-date-picker v-model="item.sdt" type="datetime" size="small" placeholder="请选择开始时间"
                                default-time="12:00:00" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss"
                                style="width:165px" clearable>
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row  justify="space-between" :gutter="24">
            <el-col :span="8">
              <el-form-item label="任务编号:" prop="name" label-width="97px">
                <el-input v-model="ruleForm.name" placeholder="自动生成" size="small" style="width:100%" clearable disabled>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="负责人:" prop="name" label-width="95px">
                <el-select v-model="ruleForm.inspBridge" placeholder="请选择负责人" size="small" style="width:100%"
                           @change="(event)=>handleBridgeChange(event)" clearable value-key="id">
                  <el-option v-for="item in bridgeOptions1" :key="item.id" :label="item.ownName" :value="item">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="巡检小组 :" :prop="'inspBridges[' + index + '].name'"
                            :rules="{required: true, message: '请选择巡小组', trigger: 'change'}" label-width="95px">
                <el-cascader v-model="item.name" :options="deasePosOptions[index]||[]"
                             @change="(event)=>handleChangeDeasePos(event,index)" :key="isResouceShow"
                             :props="{label:'name',value:'value',children:'children'}" size="small" style="width:165px"
                             placeholder="请选择巡小组" clearable>
                </el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row  justify="space-between" :gutter="24">
            <el-col :span="8">
              <el-form-item label="巡检人员 :" :prop="'inspBridges[' + index + '].itemUserList'"
                            :rules="{required: true, message: '请选择巡检员', trigger: 'change'}" label-width="95px">
                <el-select v-model="item.itemUserList" placeholder="请选择巡检人员" size="small" multiple collapse-tags
                           style="width:165px" clearable>
                  <el-option v-for="item in personOptions" :key="item.realId" :label="item.name"
                             :value="`${item.realId};${item.name}`">
                  </el-option>
                  <div style="text-align:center">
                    <el-pagination @current-change="handlePageChange_sel" :current-page.sync="currentPage_sel"
                                   :hide-on-single-page="true" :page-size="pagesize_sel" layout="prev, pager, next"
                                   :total="recordsTotal_sel">
                    </el-pagination>
                  </div>
                </el-select>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item style="margin-top: -15px; margin-left: 8px" label="范围描述:" prop="desc">
                <el-input
                  type="textarea"
                  v-model.trim="ruleForm.desc"
                  maxlength="500"
                  show-word-limit
                  size="small"
                  clearable
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="巡检关键点:" style="margin-left: 10px">
                <el-table :data="tableData" stripe :header-cell-style="{
          background: '#8595B9',
          color: '#fff',
          height: '44px',
        }" max-height="660px">
                  <el-table-column type="index" width="50"></el-table-column>
                  <el-table-column prop="name" label="关键点名称" show-overflow-tooltip></el-table-column>
                  <el-table-column property="gjdbh" label="关键点编号" show-overflow-tooltip></el-table-column>
                  <el-table-column property="xjdx" label="巡检对象" show-overflow-tooltip></el-table-column>
                  <el-table-column property="dkfs" label="打卡方式" show-overflow-tooltip></el-table-column>
                </el-table>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row  justify="space-between" :gutter="24">
            <el-col :span="8">
              <el-form-item label="巡检路线 :" :prop="'inspBridges[' + index + '].name'"
                            :rules="{required: true, message: '请选择巡检路线', trigger: 'change'}" label-width="95px">
                <el-cascader v-model="item.name" :options="deasePosOptions[index]||[]"
                             @change="(event)=>handleChangeDeasePos(event,index)" :key="isResouceShow"
                             :props="{label:'name',value:'value',children:'children'}" size="small" style="width:165px"
                             placeholder="请选择巡检路线" clearable>
                </el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="16">
              <el-form-item  style="margin-left: 10px">
                <div class="map_box" id="mapContaion">
                </div>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
           <!-- <el-col :span="24">
              <el-form-item  style="margin-left: 10px">
                <div class="map_box" id="mapContaion">
                </div>
              </el-form-item>
            </el-col>-->
          </el-row>

        </div>

      </div>
    </el-form>
  </vx-popup>

</template>

<script>
  export default {
    props: {
      createType: {
        type: Number,
        required: true,
        default: 4
      }
    },
    data() {
      return {
        tableData: [{
          index: 1,
          name: '滨江大桥',
          gjdbh: '001',
          xjdx: '桥名牌',
          dkfs: '现场签到'
        },{
          index: 2,
          name: '城闸大桥',
          gjdbh: '002',
          xjdx: '桥名牌',
          dkfs: '现场签到'
        },{
          index: 3,
          name: '通吕一号桥',
          gjdbh: '003',
          xjdx: '桥名牌',
          dkfs: '现场签到'
        },],
        isResouceShow: 0,
        dialogTitle: '新增任务',
        dialogVisible: false,
        editId: '',
        bridgeOptions: [],
        personOptions: [],
        deasePosOptions: {},
        ruleForm: {
          name: '',
          inspType: '',
          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            sdt: '',
            duration: '',
            itemUserList: []
          }]
        },
        rules: {
          name: [{
            required: true,
            message: "请输入任务名称",
            trigger: "blur"
          }],
          inspType: [{
            required: true,
            message: "请选择巡检类型",
            trigger: "change"
          }]
        },
        currentPage_sel: 1,
        pagesize_sel: 10,
        recordsTotal_sel: 0
      };
    },
    created() {
      this.queryBridgeList();
      this.queryPersonList(1);
    },
    mounted() {
      this.getInspManage()
    },
    methods: {
      getInspManage(){
        // 初始化地图
        /*this.initMap(120.826, 32.02);*/
        var tile = new T.TileLayer("http://t4.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=62ea4c72da74f4ae7d76f36d45bc9a20");
        var map = new T.Map("mapContaion", {layers: [tile]});
        /*map.centerAndZoom(new T.LngLat(120.826, 32.02), 13);*/
        map.centerAndZoom(new T.LngLat(116.318090, 39.920270), 13);
        var _CarTrack = new T.CarTrack(map, {
          interval: 5,
          speed: 10,
          dynamicLine: true,
          polylinestyle: {color: "#2C64A7", weight: 5, opacity: 0.9},
          Datas: datas.features.map(function (obj, i) {
              var coordinates = obj.geometry.coordinates;
              var lnlat = new T.LngLat(coordinates[0], coordinates[1]);
              return lnlat;
            }
          )
        })
      },
      add(val) {
        this.emptyForm();
        this.editId = null;
        if (this.createType === 1) {
          this.queryTmplById(val);
        }
        if (this.createType === 3) {
          this.queryPlanById(val);
        }
        this.dialogTitle = '新增任务';
        this.dialogVisible = true;
      },
      edit(val) {
        this.$refs["ruleForm"].resetFields();
        this.dialogTitle = '编辑任务';
        this.dialogVisible = true;
        this.editId = val;
        this.queryTaskById(val);
      },
      emptyForm() {
        this.$refs["ruleForm"].resetFields();
        const emptyObj = {
          name: '',
          inspType: '',

          inspBridges: [{
            bridge: '',
            name: [],
            inspStandard: '',
            itemUserList: [],
            duration: '',
            sdt: ''
          }]
        }
        this.ruleForm = emptyObj;
      },
      queryBridgeList() {
        this.$api.bridge.AllTheBridges().then(response => {
          console.log('桥梁列表');
          console.log(response);
          if (response.data.success) {
            this.bridgeOptions = response.data.data[0];
            console.log(this.bridgeOptions);
          }
        });
      },
      queryTaskById(val) {
        this.$api.insp.queryTaskById(val).then(response => {
          console.log('任务详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
        });
      },
      queryTmplById(val) {
        this.$api.insp.queryTmplById(val).then(response => {
          console.log('模板详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);
            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      queryPlanById(val) {
        this.$api.insp.queryPlanById(val).then(response => {
          console.log('计划详情');
          console.log(response);
          const _data = response.data.data;

          let _inspBridges = _data.itemList.map((item, index) => {
            let _itemUserList = item.itemUserList.map(userItem => `${userItem.userId};${userItem.userName}`);
            let _ext1 = JSON.parse(item.ext1);
            this.handleBridgeChange(_ext1, index);

            return {
              name: [`${item.constructionId};${item.constructionName}`,
                `${item.partsId};${item.partsName}`
              ],
              inspStandard: item.inspStandard,
              bridge: _ext1,
              itemUserList: _itemUserList
            }
          });
          let _ruleForm = {
            name: _data.name,
            inspType: _data.inspType,
            inspBridges: _inspBridges
          }
          this.ruleForm = _ruleForm;
          this.$refs["ruleForm"].resetFields();
        });
      },
      handleSubmit() {
        this.$refs.ruleForm.validate(async (valid) => {
          if (!valid) {
            return false;
          }
          let _userInfo = JSON.parse(localStorage.getItem("userInfo"));
          let _itemList = this.ruleForm.inspBridges.map(item => {
            let _itemUserList = item.itemUserList.map(temp => ({
              userId: temp.split(';')[0],
              userName: temp.split(';')[1],
            }));
            let _ext1 = {
              // ...item.bridge,
              id: item.bridge['id'] || '',
              name: item.bridge['name'] || '',
              lng: item.bridge['lng'] || '',
              lat: item.bridge['lat'] || '',
              bridgeTypeId: item.bridge['bridgeTypeId'] || '',
              bridgeTypeName: item.bridge['bridgeTypeName'] || '',
              province: item.bridge['provinceName'] ? item.bridge['provinceName'] : item.bridge[
                'province'] ? item.bridge['province'] : '',
              city: item.bridge['municipalityName'] ? item.bridge['municipalityName'] : item.bridge[
                'city'] ? item.bridge['city'] : '',
              area: item.bridge['regionName'] ? item.bridge['regionName'] : item.bridge[
                'area'] ? item.bridge['area'] : '',
              standardName: item.bridge['standardName'] || '',
            };
            return {
              name: item.name.length > 0 ? `${item.name[0].split(';')[1]}/${item.name[1].split(';')[1]}` : '',
              constructionId: item.name.length > 0 ? item.name[0].split(';')[0] : '',
              constructionName: item.name.length > 0 ? item.name[0].split(';')[1] : '',
              partsId: item.name.length > 0 ? item.name[1].split(';')[0] : '',
              partsName: item.name.length > 0 ? item.name[1].split(';')[1] : '',
              ownId: item.bridge['id'] || '',
              ownName: item.bridge['name'] || '',
              inspTaskCfgPos: {
                ownId: item.bridge['id'] || '',
                ownName: item.bridge['name'] || '',
                lon: item.bridge['lng'] || '',
                lat: item.bridge['lat'] || '',
              },
              inspStandard: item.inspStandard,
              itemUserList: _itemUserList,
              sdt: item.sdt,
              duration: item.duration,
              ext1: JSON.stringify(_ext1)
            }
          });
          let _params = {
            createUserId: _userInfo['userid'] || '',
            createUserName: _userInfo['realname'] || '',
            createType: this.createType,
            name: this.ruleForm.name,
            inspType: this.ruleForm.inspType,
            itemList: _itemList
          };

          if (this.editId) {
            _params.id = this.editId;
          }
          if (this.editId) {
            this.$api.insp.updateTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '修改成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          } else {
            this.$api.insp.addTask(_params).then(response => {
              if (response.data.success) {
                this.$vs.notify({
                  text: '新增成功',
                  color: "success",
                  icon: "success"
                });
                this.dialogVisible = false;
                this.$emit("closeAddInspTask");
              }
            });
          }
        });
      },
      cancelSubmit() {
        this.dialogVisible = false;
      },
      handleBridgeChange(event, index) {
        console.log(event);
        const _params = {
          bridgeTypeId: event['bridgeTypeId'] || '',
          pId: '-1',
          bridgeId: event['id'] || ''
        };
        this.queryConstructionModelTreeById(_params, index);
      },
      handleChangeDeasePos(event, index) {
        console.log(this.ruleForm.inspBridges[index].name);
      },
      deepDeasePosOptions(data) {
        let _arr = [];
        let _obj = {};
        data.forEach(item => {
          const _tmp = {
            ...item
          };
          if (_tmp.children && _tmp.children.length > 0) {
            _tmp.children = this.deepDeasePosOptions(_tmp.children);
          }
          _obj = {
            id: _tmp.id,
            name: _tmp.name,
            value: `${_tmp.id};${_tmp.name}`,
          }
          if (_tmp.children && _tmp.children.length > 0) {
            _obj.children = _tmp.children;
          }
          _arr.push(_obj);
        });
        return _arr;
      },
      queryConstructionModelTreeById(_params, index) {
        this.$api.bridge.queryConstructionModelTreeById(_params).then(response => {
          if (response.data.success) {
            ++this.isResouceShow;
            this.deasePosOptions[index] = this.deepDeasePosOptions(response.data.data.children);
          }
        });
      },
      queryPersonList(pageIndex) {
        if (pageIndex && pageIndex === 1) {
          this.currentPage_sel = 1;
        }
        const _params = {
          pageSize: this.pagesize_sel,
          pageNum: this.currentPage_sel,
          type: '0'
        }
        this.$api.personManager.getPersonList(_params).then(response => {
          if (response.data.success) {
            this.personOptions = response.data.data;
            this.recordsTotal_sel = response.data.recordsTotal;
          }
        });
      },
      handlePageChange_sel(currentPage) {
        this.currentPage_sel = currentPage;
        this.queryPersonList();
      },
    }
  }

</script>
<style lang="scss" scoped>
  @import '@/assets/scss/baseColor.scss';
  @import '../insp.scss';
  .map_box {
    width: 100%;
    height: 300px;
    /*height: 100vh;*/
    background: papayawhip;
    // margin-top: 20px;
  }

</style>

